import _ from 'lodash';
import './style.css';
import BgImage from "./bg.jpg"

/**
 * 创建div容器
 * @returns {HTMLDivElement}
 */
function component() {
    var element = document.createElement('div');
    element.classList.add('container');

    //将图像添加到已存在的div中
    var box_image = document.createElement('div');
    box_image.classList.add('thumbail');
    const image = new Image()
    image.src = BgImage
    box_image.appendChild(image)
    element.appendChild(box_image)
    //loadsh
    var title = document.createElement('div');
    // lodash 是由当前 script 脚本 import 导入进来的
    title.innerHTML = _.join(['Hello', 'webpack'], ' ');
    title.classList.add('title');
    element.appendChild(title)
    //加入字体库
    const subtitle = document.createElement('div');
    subtitle.innerText = "This is the demo of webpack !"
    subtitle.classList.add('subtitle');
    element.appendChild(subtitle)


    return element;
}

document.body.appendChild(component());
